<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/datasource/datasource-beta-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/datatable/datatable-beta-min.js"></script>
<script type="text/javascript" src="../data.js"></script>

<div id="dynamic-datatable-simple">
	<h3>Datatable: Dynamic Content with a datatable control inside</h3>
	<p>
  	  <strong>Facts:</strong><br />
		- The script tags inside the tab will be executed every time the tab get the focus.<br />
		- The dynamic links was created on the fly.<br />
	</p>
    <div id="basic" class="example"></div>
</div>  
<script type="text/javascript">
	
	var myColumnHeaders = [
	    {key:"id", sortable:true, resizeable:true},
	    {key:"date", type:"date", sortable:true, resizeable:true},
	    {key:"quantity", type:"number", sortable:true, resizeable:true},
	    {key:"amount", type:"currency", sortable:true, resizeable:true},
	    {key:"title", type:"html", sortable:true, resizeable:true}
	];
	
	var myColumnSet = new YAHOO.widget.ColumnSet(myColumnHeaders);
	
	var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
	myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
	myDataSource.responseSchema = {
	    fields: ["id","date","quantity","amount","title"]
	};
	var myDataTable = new YAHOO.widget.DataTable("basic", myColumnSet, myDataSource,{caption:"Example: Basic Table"});
	
</script>
